<template>
	<view class="login-page">
		<!-- 插画及文案区域 -->
		<view class="illustration-area">
			<image class="illustration-img" src="/static/images/login-illustration.png" mode="widthFix"></image>
			<text class="title">首次登录即享新人专属礼</text>
		</view>

		<!-- 登录按钮区域 -->
		<view class="btn-area">
			<u-button class="one-click-login" @click="doLogin" text="一键登录"></u-button>
			<u-button class="phone-login" text="手机号安全登录" shape="circle" color="#ffffff" border-color="#000000"></u-button>
			<view class="skip-login">暂不登录</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// isAgree: false
			};
		},
		onLoad() {
			// this.getUserInfo()
		},
		methods: {
			// getUserInfo() {
			// 	console.log(111)
			// 	return new Promise((resolve, reject) => {
			// 		uni.getUserProfile({
			// 			lang: 'zh_CN',
			// 			desc: '用户登录', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，
			// 			success: (res) => {
			// 				console.log(res, 'resss')
			// 				resolve(res.userInfo)
			// 			},
			// 			fail: (err) => {
			// 				reject(err)
			// 			}
			// 		})
			// 	})
			// },
			doLogin() {
				// 2. 调用 uni.login 获取 code
				uni.login({
					"provider": "weixin",
					"onlyAuthorize": true,
					success: (loginRes) => {
						console.log('获取code成功:', loginRes);
						// 3. 将 code 发送到服务器换取 token
						this.getTokenFromServer(loginRes.code);
					},
					fail: (err) => {
						console.error('登录失败:', err);
						uni.showToast({
							title: '登录失败，请重试',
							icon: 'none'
						});
					}
				});
			},

			getTokenFromServer(code) {
				// console.log(code)
				let result = this.$u.api.user.login({
					'code': code
				});
				// console.log(this.code)
				// 4. 调用后端接口，传递 code
				// uni.request({
				// 	url: 'https://your-api.com/api/login',
				// 	method: 'POST',
				// 	data: {
				// 		code: code
				// 	},
				// 	success: (res) => {
				// 		if (res.data.code === 200) {
				// 			// 5. 存储 token 到本地
				// 			uni.setStorageSync('token', res.data.data.token);
				// 			uni.showToast({
				// 				title: '登录成功',
				// 				icon: 'success'
				// 			});
				// 			// 6. 跳转到首页或其他页面
				// 			uni.switchTab({
				// 				url: '/pages/index/index'
				// 			});
				// 		} else {
				// 			uni.showToast({
				// 				title: res.data.message || '登录失败',
				// 				icon: 'none'
				// 			});
				// 		}
				// 	},
				// 	fail: (err) => {
				// 		console.error('获取token失败:', err);
				// 		uni.showToast({
				// 			title: '网络错误，请重试',
				// 			icon: 'none'
				// 		});
				// 	}
				// });
			},
			// doLogin() {
			// 	// console.log('111')
			// 	// 2. 调用 uni.login 获取 code
			// 	uni.login({
			// 		"provider": "weixin",
			// 		"onlyAuthorize": true, // 微信登录仅请求授权认证
			// 		success: function(event) {
			// 			const {
			// 				code
			// 			} = event
			// 			console.log(event, '这是event')
			// 			getToken(event.code)
			// 			//客户端成功获取授权临时票据（code）,向业务服务器发起登录请求。
			// 			// let result = this.$u.api.user.login({});
			// 			// console.log(result);
			// 			// uni.request({
			// 			// 	url: 'http://www.milkshopback.com/Milk/User/login', //仅为示例，并非真实接口地址。
			// 			// 	data: {
			// 			// 		code: event.code
			// 			// 	},
			// 			// 	success: (res) => {
			// 			// 		console.log(res, '这是res')
			// 			// 		//获得token完成登录
			// 			// 		// uni.setStorageSync('token', res.token)
			// 			// 	}
			// 			// });
			// 		},
			// 		fail: function(err) {
			// 			// 登录授权失败
			// 			// err.code是错误码
			// 		}
			// 	})

			// },
			// getToken(code) {
			// 	console.log(code, 'hhhhhhh')
			// }
		}
	};
</script>

<style lang="scss" scoped>
	.login-page {
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 0 20rpx;
		background-color: #ffffff;

		.illustration-area {
			display: flex;
			flex-direction: column;
			align-items: center;
			margin-top: 100rpx;

			.illustration-img {
				width: 200rpx;
			}

			.title {
				font-size: 32rpx;
				color: #333333;
				margin-top: 40rpx;
			}
		}

		.btn-area {
			display: flex;
			flex-direction: column;
			width: 100%;
			margin-top: 80rpx;

			.one-click-login {
				background-color: #000000;
				color: #ffffff;
				border-radius: 50rpx;
				font-size: 32rpx;
				height: 80rpx;
				line-height: 80rpx;
			}

			.phone-login {
				margin-top: 30rpx;
				background-color: #ffffff;
				color: #000000;
				border-radius: 50rpx;
				font-size: 32rpx;
				height: 80rpx;
				line-height: 80rpx;
			}

			.skip-login {
				text-align: center;
				margin-top: 40rpx;
				color: #999999;
				font-size: 28rpx;
			}
		}

		.agreement-area {
			position: fixed;
			bottom: 40rpx;
			left: 0;
			width: 100%;
			padding: 0 20rpx;
			box-sizing: border-box;

			.protocol-text {
				color: #000000;
				text-decoration: underline;
			}
		}
	}
</style>